<script setup>
import {computed, ref} from 'vue';
import axios from 'axios';
import { showMsg } from '@/views/Util';
let props=defineProps(['user','type','title','list2'])
let emits=defineEmits(['submit','close'])
let obj=computed(()=>{
  return props.user;
})
function edit(){
  axios.put('/api/user_update',obj.value,{
    headers:{
      "Content-Type":"application/json"
    }
  }).then(res=>{
    if(res.data.status==200){
            emits('submit');
        }else{
            showMsg(res.data.msg,'warn',2000);
        }
  })
}
</script>

<template>
  <div class="box">
    <div class="title">
      <h3>{{ title }}</h3>
      <img src="../../img/错误.png" alt="" @click="emits('submit')">
    </div>
    <select id="pl" v-model="obj.role">
      <option value="admin">管理员</option>
      <option value="student">学生</option>
      <option value="teacher">老师</option>
    </select>
    <el-radio-group v-model="obj.status">
        <el-radio value="normal">正常</el-radio>
        <el-radio value="disable">禁用</el-radio>
        <el-radio value="lock">锁定</el-radio>
    </el-radio-group>

    <input v-if="type=='edit'" type="button" value="提交" @click="edit" class="sub">

  </div>
</template>

<style scoped>
.box{
  width: 300px;
  height: 280px;
  border: 1px solid #eee;
  position: absolute;
  margin: 10% 25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 5px;
  background-color: #fff;
  box-shadow: 0 0 10px #eee;
  cursor: pointer;
}
.box>.title{
  width: 280px;
  height: 30px;
  display: flex;
  justify-content: space-between;
  align-items: center;

}
.box>.title>h3{
  color: #0aa;
}
.box>.title>img{
  width: 30px;
  height: 30px;
}
.box>input{
  width: 280px;
  height: 30px;
  border: none;
  background-color: #eee;
}
.box>.sub{
  width: 290px;
  height: 30px;
  background-color: pink;
  color:#fff;
  border: none;
}
.box .sex{
  width: 280px;
}
select{
  width: 280px;

}

</style>